import React from 'react'
import {WebView} from 'react-native-webview'

import {
    SafeAreaView,
    TextInput,
    View,
    Text,
    StyleSheet
} from 'react-native'
import List from './list'


class Demo1 extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            text: ''
        }
    }

    componentDidMount() {
        
    }
    render() {
        return (
            <SafeAreaView style={{
                    flex: 1
                }}>
                <View style={{
                    flex: 1,
                    backgroundColor: 'pink'
                }}
                >
                    <Text
                        ellipsizeMode="middle"
                        numberOfLines={2}
                    >一个用于显示文本的React组件，并且它也支持嵌套、样式，以及触摸处理，在Text内部的元素不再使用flexbox布局，而是采用文本布局。这意味着Text内部的元素不再是一个个矩形，而可能会在行末进行折叠</Text>
                    <TextInput 
                        style={style.textinput}
                        keyboardType="email-address"
                        maxLength={20}
                        editable={true}
                        caretHidden={true}
                        autoCapitalize="words"
                        onChangeText={text => this.setState({text})}
                    ></TextInput>
                    <Text>{this.state.text}</Text>
                    {/* <WebView
                        source={{uri: 'https://www.baidu.com/'}}
                    ></WebView> */}
                    <List></List>
                </View>
            </SafeAreaView>
        )
    }
}

const style = StyleSheet.create({
    textinput: {
        width: 100,
        height: 50,
        borderWidth: 3,
        borderColor: "blue"
    }
})

export default Demo1